简介:你是否也有过这样的“烦恼”:
* 对前端技术感兴趣不知道从何学起?
* 想从事前端工作却没有基础?
想要成为一名合格的前端工作者,HTML与CSS是必不可少的技能,但是对于新手工程师来讲,这部分也是最难掌握的。
本门课程专为零基础学员设计,囊括了目前使用比较广泛的HTML+CSS基础知识,以知识点结合小案例的形式书写代码,学与练结合,帮助学员顺利入门。
课程从最基本的概念讲起,逐步深入,带你学习HTML(5)和CSS(3)样式基础知识,了解各种常用标签的意义以及基本用法,讲解CSS(3)样式代码添加,为后续更深入的学习打好基础。
通过本门课程的学习,你可以基本掌握前端必备的HTML+CSS样式基础知识,并可以利用这些知识实现静态页面。
第1章 HTML5介绍
本章节主要讲解html5和css3样式的关系,以及html5标签语法,文档结构,最后讲解了在html5中的注释代码的作用。
第2章 HTML5语义化标签
本章节主要讲解html5中常用语义化标签,知道哪部分使用什么标签。
第3章 HTML5效果标签
本章主要讲解效果标签,为网页可以添加换行,空格,水平线等效果。
第4章 HTML5列表标签
本章主要讲解两种列表标签效果,主要用于列表项。
第5章 HTML5图片,链接及表格标签
本章节主要讲解图片,链接及table标签使用,学完本章,我们可以在网页上展示一些图片及表格数据,使网页上的信息更加丰富
第6章 HTML5表单标签,与浏览者交互
我们每天都在网上冲浪,如果没有表单,人们就无法输入自己的个人信息来买东西,本章节主要从表单的作用、表单元素讲起,学习完本章,可以制出简单的用户登陆、注册页面。
- 编程: 6-1 使用表单标签,与用户交互 - 使用<form>创建表单
- 编程: 6-2 先来填用户名和密码 - 文本输入框、密码输入框
- 编程: 6-3 给点提示呗 - placeholder属性的使用
- 编程: 6-4 在家呆多少天啦? - 数字输入框
- 编程: 6-5 平时都逛论坛么? - 网址输入框
- 编程: 6-6 留个邮箱,方便通知消息 - 邮箱输入框
- 编程: 6-7 留下您宝贵的意见 - 使用<textarea>标签创建文本域
- 编程: 6-8 使用label为input标签穿上衣服
- 编程: 6-9 填填性别和兴趣爱好 - 单选框、复选框,让用户选择
- 编程: 6-10 使用select、option标签创建下拉菜单
- 编程: 6-11 填完就可以提交咯 - 提交按钮
- 编程: 6-12 使用重置按钮,重置表单信息
第7章 CSS3介绍,为网页添加样式
CSS3是一个很神奇的东西,设计者可以通过修改样式表的定义而使网页呈现出完全不同的外观。本章就开始带领大家来学习CSS3样式:先来认识CSS3样式、了解CSS3样式的优势、CSS3代码语法,CSS3注释代码和CSS3链接方式以及优先级。
第8章 CSS3选择器
本章主要介绍CSS的选择器,通过学习本章,我们能对元素进行样式的设置
第9章 CSS3的继承,优先级和重要性
CSS中有一些概念是需要深刻理解的,此节开始将介绍CSS中的一些非常重要的概念包括CSS的继承,优先级和重要性
第10章 CSS3字体样式
本章将详细介绍网页排版中字体要素,帮助读者把CSS3技术与网页字体紧密结合在一起,实现网页实用性与欣赏性相结合,实现出设计效果。
第11章 CSS3文本样式
本章节主要介绍文本中常用的下划线,缩进,行高,文本对齐方式,以及透明色,长度值等设置,让页面中文本样式看起来更美观一些。
第12章 CSS3盒模型
盒模型是CSS布局的基石,它规定了网页元素如何显示以及元素间相互关系。本章将围绕盒模型的概念、结构、尺寸等基础知识展开研究,以便为后面的学习和日后网页设计奠定扎实的基础。
- 编程: 12-1 给元素分个类 - 元素分类
- 编程: 12-2 我要独占一行 - 块级元素
- 编程: 12-3 我要和你站一起 - 内联元素
- 编程: 12-4 我还要站个大位置 - 内联块状元素
- 编程: 12-5 隐身术 - none不占据位置
- 视频: 12-6 变个盒子-什么是盒模型(视频) (02:14)
- 编程: 12-7 长胖长高点--宽度和高度
- 编程: 12-8 设置个美美哒的颜色-背景色
- 编程: 12-9 画个圈圈 - 使用border为盒子添加边框(一)
- 编程: 12-10 我想脚下踩条线 - 使用border为盒子添加边框(二)
- 编程: 12-11 加个圆角 - 使用border-radius设置圆角
- 编程: 12-12 宰相肚里能撑船 - 使用padding为盒子设置内边距(填充)
- 编程: 12-13 距离产生美 - 使用margin为盒子设置外边距(边界)
第13章 CSS3布局模型
现在可以用所需的知识进行真正设计了,学习完本章节可以运用所学习的知识实现网页的多列布局,本章将围绕流动模型、浮动模型、层布局模型等布局技术展开研究,以便为后面制作复杂的网页打下基础。
第14章 flex弹性盒模型
本章讲解flex布局的设置以及常用相关属性,能够更好,更快速的实现网页布局。
第15章 css样式设置小技巧
本章节对在日常前端开发中常用到css样式设置小技巧进行了讲解。